<template>
  <view class="goods_list">
    <!-- 搜索栏 -->
    <YgSearch></YgSearch>
    <!-- tabs栏 -->
    <u-tabs
      :list="list"
      :is-scroll="false"
      :current="current"
      @change="change"
      bar-width="184"
      bar-height="4"
      active-color="#ff2d4a"
      :active-item-style="{ color: `black` }"
    ></u-tabs>
    <!-- 商品 -->
      <YgCell
        v-for="item in goodsList"
        :key="item.goods_id"
        :goodsObj="item"
        :price="true"
         :url="`/pages/goods_detail/goods_detail?goods_id=${item.goods_id}`"
      >
      </YgCell>
    <view v-show="haveMore" class="hint u-text-center u-p-30">没有更多了</view>
  </view>
</template>

<script>
// 默认传参数据
let params = {
  // 否	string	关键字
  query: "",
  // 否	string	分类id
  cid: "",
  // 否	number	页码
  pagenum: 1,
  // 否	number	页容量
  pagesize: 10,
};
let total = 0; //总条数
export default {
  data() {
    return {
      list: [
        {
          name: "综合",
        },
        {
          name: "销量",
        },
        {
          name: "价格",
        },
      ],
      current: 0,
      goodsList: [], //综合排序
      haveMore: false, //是否显示没有更多
    };
  },
  methods: {
    // tabs栏切换事件
    change(index) {
      this.current = index;
    },
    // 传值获取商品列表数据!!!
    async getGoodsSearch() {
      const res = await this.$u.api.getGoodsSearch(params);
      console.log(res);
      // 展开数据上拉到底添加到数据后面
      this.goodsList = [...this.goodsList, ...res.message.goods];
      // 返回值有一个总条数
      total = res.message.total;
    },
  },
  // option 获取页面传参数据
  onLoad(option) {
    // 传参的cid赋值给全局变量
    params.cid = option.cid ? option.cid:"";
    params.query = option.query ? option.query:"";
    console.log(option,params);
    this.getGoodsSearch();
  },
  // 页面滚动到底部的事件 钩子
  onReachBottom() {
    console.log("到底啦");
    // 如果数据长度等于总条数 就不运行了
    if (this.goodsList.length === total) {
      this.haveMore = true;
    } else {
      params.pagenum++;
      this.getGoodsSearch();
    }
  },
  // 下拉刷新
  async onPullDownRefresh() {
    this.haveMore = false; //把没有更多了 隐藏
    this.goodsList = []; //清空数据
    params.pagenum = 1; //从新设置请求第一页数据
    await this.getGoodsSearch(); //调用函数获取数据
    uni.stopPullDownRefresh(); //关闭下拉刷新
  },
};
</script>

<style>
</style>